<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>this练习题</title>
  </head>
  <body>
    <script>
      //  //T1.
      //   function fun() {
      //     console.log(this.s);
      //   }
      //   var obj = {
      //     s: 1,
      //     f: fun,
      //   };
      //   var s = 2;
      //   obj.f();//1
      //由于是obj调用函数的，所以这里的this.s是指向obj对象里面的s的键值

      // //T2.
      //   function fun() {
      //     console.log(this.s);
      //     var obj = {
      //       s: 1,
      //       f: fun,
      //     };
      //   }
      //   var s = 2;
      //   fun();//2
      // 这里是普通的函数调用，所以this.s是指向window的s

      // //T3.
      //   var A = {
      //     name: "jmq",
      //     f: function () {
      //       console.log(this.name);
      //     },
      //   };
      //   var B = {
      //     name: "syc",
      //   };
      //   B.f = A.f;//B对象里添加了A对象里的函数
      //   A.f();//"jmq"
      //   B.f();//"syc"
      //第一个是A对象调用了函数，所以this.name是指向A对象里的name的键值
      //第二个是B对象调用了函数，这里的this.name是指向B对象里面name键值

      //T4.
      // function fo() {
      //   console.log(this.a);
      // }
      // var o1 = {
      //   a: 3,
      // };
      // var o2 = {
      //   a: 6,
      // };
      // var a = 9;
      // o1.f = fo;//o1对象里面添加fo函数
      // console.log(o1);//添加后{a:3,f:fo()}
      // o2.f = o1.f;//o1对象里面的函数添加到o2里面
      // o1.f(); // 输出什么？//3
      // o2.f(); // 输出什么？//6
      // 第一个是o1调用的函数，所以函数里的this.a指向o1对象里面的a键值
      // 第二个是o2调用的函数，所以函数里的this.a指向o2对象里面的a键值

      //T5.
      // function foo() {
      //   console.log(this.a);
      // }
      // var obj2 = {
      //   a: 2,
      //   fn: foo,
      // };
      // var obj1 = {
      //   a: 1,
      //   o1: obj2,
      // };
      // obj1.o1.fn(); // 输出的是啥？//2
      //这里是obj1.o1调用的函数，所以this.a是指向obj.o1里面a的键值
      //因为obj1.o1的键值是obj2
      //obj1.o1.a的键值就是obj2.a的键值

      //T6.
      // var a = 10;
      // var obj = {
      //   a: 120,
      //   method: function () {
      //     var bar = function () {
      //       console.log(this.a); // 输出什么？//10
      //     };
      //     bar();
      //     return this.a; // 输出什么？//120
      //   },
      // };
      // console.log(obj.method());
      //第一个this.a是普通的函数调用，所以是指向window的a的值
      //第二个this.a是obj函数调用，所以指向的是obj.a的值

      // T7.
      // var fullName = "language";
      // var obj = {
      //   fullName: "javascript",
      //   prop: {
      //     getFullName: function () {
      //       return this.fullName;
      //     },
      //   },
      // };
      // console.log(obj.prop.getFullName()); // 这里输出什么？undefined
      // var test = obj.prop.getFullName;
      // console.log(test()); // 这里输出什么//"language"
      // 第一个是obj.prop调用了这个函数，所以this.fullName是指向obj.prop
      //但是obj.prop里不存在fullName，所以是undefined
      //第二个是普通的函数调用，this.fullName指向的是window

      // //T8.
      // function fn() {
      //   console.log(this);
      // }
      // setInterval(fn, 1000); // 这里打印啥？//隔一秒钟打印一行window
      //这里属于定时器处理函数，this指向的是window

      // //T9.
      // var k = {
      //   a: 1,
      //   sing: function () {
      //     console.log(this);
      //   },
      // };
      // setTimeout(k.sing(), 1000); // 这里打印的是啥？//一秒后打印k对象
      //这里是在定时器里面，对象k调用了sing函数，所以this指向的是整个k对象

      // //T10.
      // var value = 8;
      // var obj = {
      //   value: 10,
      //   fn: () => {
      //     console.log(this.value); //打印什么//8
      //   },
      // };
      // obj.fn();
      //箭头函数没有this，它只能往外找，但这里没有函数包着箭头函数
      //所以this.value最终是指向window
    </script>
  </body>
</html>
